<template id="grade_item">
    <div class="form-group">
        <label class="control-label col-xs-12 col-sm-2">题目{{index+1}}{:__('Grade')}</label>
        <div class="col-xs-12 col-sm-8">
            <select v-model="grade" name="grade[]" class="form-control" data-rule="required">
                <option value="0">{:__('Grade 1')}</option>
                <option value="1">{:__('Grade 2')}</option>
                <option value="2">{:__('Grade 3')}</option>
                <option value="3">{:__('Grade 4')}</option>
                <option value="4">{:__('Grade 5')}</option>
            </select>
        </div>
    </div>
</template>
<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div id="form_div">
    <div class="form-group">
        <label for="money" class="control-label col-xs-12 col-sm-2">{:__('Money')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="money" data-rule="required;number;range[0~]" class="form-control" name="row[money]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label for="answer_money" class="control-label col-xs-12 col-sm-2">{:__('Answer money')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input id="answer_money" data-rule="required;number;range[0~]" class="form-control" name="row[answer_money]" type="text" value="">
        </div>
    </div>
    <div class="form-group">
        <label for="topic_number"class="control-label col-xs-12 col-sm-2">{:__('Topic number')}:</label>
        <div class="col-xs-12 col-sm-8">
            <input  v-model="topic_number"  id="topic_number" data-rule="required;number;range[0~]" class="form-control" name="row[topic_number]" type="text" value="">
        </div>
    </div>

    <div >
        <div :is="item.component"  @on-grade-change="onGradeChange"  :index="item.index" :grade="item.grade"   v-for="item in topic_grade"></div>
    </div>
    </div>
    <div class="form-group layer-footer">
        <label class="control-label col-xs-12 col-sm-2"></label>
        <div class="col-xs-12 col-sm-8">
            <button type="submit" class="btn btn-success btn-embossed disabled">{:__('OK')}</button>
            <button type="reset" class="btn btn-default btn-embossed">{:__('Reset')}</button>
        </div>
    </div>
</form>
